import React from 'react';
import { Router, Route, Redirect, Switch } from 'react-router-dom';
import history from '@/utils/history';
import Article from './pages/Article';
import Chat from './pages/Profile/Chat';
import ProfileFeedback from './pages/Profile/Feedback';
import SearchResult from './pages/Search/Result';
import Loading from '@/components/Loading';
import AuthRoute from '@/components/AuthRoute';
// 懒加载
const Login = React.lazy(() => import('@/pages/Login'));
const Layout = React.lazy(() => import('@/pages/Layout'));
const ProfileEdit = React.lazy(() => import('@/pages/Profile/Edit'));
const Search = React.lazy(() => import('./pages/Search'));
const NotFound = React.lazy(() => import('@/pages/NotFound'));

export default function App() {
  return (
    <>
      <Router history={history}>
        <React.Suspense fallback={<Loading />}>
          <Switch>
            <Redirect exact path="/" to="/layout/home" />
            <Route path="/login" component={Login} />
            <Route path="/layout" component={Layout} />
            {/* 不使用 tab 布局的界面 */}
            <Route path="/search" component={Search} />
            <Route path="/article/:id" component={Article} />
            <Route path="/search/result" component={SearchResult} />
            <AuthRoute path="/profile/edit" component={ProfileEdit} />
            <AuthRoute path="/profile/chat" component={Chat} />
            <AuthRoute path="/profile/feedback" component={ProfileFeedback} />
            <Route path="/profile/feedback" component={ProfileFeedback} />
            <Route path="/search" component={Search} />
            <Route path="*" component={NotFound} />
          </Switch>
        </React.Suspense>
      </Router>
    </>
  );
}
